import React, { Component } from 'react'
import img from './logo.png'
import Uls from './uls'
import Logo from "../../../component/logo/"

const h0 = '50px'
let style ={
    container:{
        'width':'1200px',
        'height':'auto',
        'margin':'auto',
        'paddingTop':'20px',
        'display':'flex',
        'flexDecliation':'row',
        'justifyContent':'space-between',
    },
    logo:{
        'width':'50px',
        'height':'50px',
        'backgroundColor':'green', 
    },
    titleUls:{
        'width': '1100px',
        'height': h0,
        'lineHeight': h0,
    }
}
class Container extends Component {
    constructor(props) {
        super(props)
        this.state = {
            img,
            login:true,
        }
    }
    componentWillMount() {
        
    }
    changeState = () => {
        this.setState({login: !this.state.login})
    }
    render() {
        const text = this.state.login ? '登录' : '退出'
        return <div className="container" style={style.container}>
            <Logo />
            <div className='titleUls' style={style.titleUls}>
                <Uls />
            </div>
            <div>
                <a onClick={this.changeState}>{text}</a>
            </div>
        </div>
    }
}

export default Container